22825
4693 
Jeg er en absolutt nybegynner, har studert selv i to uker som forberedelse til en bootcamp som kommer om en måned. I et forsøk på å forbedre ferdighetene mine og "lære å tenke som en utvikler", har jeg tatt på meg et prosjekt som prøver å løse et problem i den virkelige verden.
Min kone driver en virksomhet som krever at hun genererer fakturaer for sine kunder. Jeg prøver å bruke HTML og JavaScript til å bygge et nettbasert program som gjør at hun raskt kan lage tilpassede fakturaer i stedet for å skrive dem ut manuelt hver gang.
I den nåværende versjonen ber en ledetekst om et nummer fra henne. Dette tallet genererer like mange rader med tre kolonner i HTML. Dette gjør at hun kan tilpasse fakturaen med nøyaktig antall felt hun trenger.
Kolonne 1 inneholder produktnavnet. I samme rad inneholder kolonne 2 antall enheter, mens kolonne 3 inneholder den totale kostnaden for det produktet, som er basisprisen ganget med antall enheter. Jeg vil at denne beregningen skal skje med et knappeklikk. Men jeg sitter fast.
For å kunne utføre matematikken må jeg kunne få heltallene fra hver rad og kolonne og overføre dem til en funksjon. Men fordi hver rad og kolonne ble generert automatisk, har de ingen unike attributter og kan dermed ikke identifiseres. Jeg er i stand til å utføre matematikken nedover i hver kolonne, men ikke på tvers av hver rad.
Siden jeg er så ny, bare har lært fra et par innledende Codecademy-kurs og noen YouTube-videoer, vet jeg ikke hvordan jeg skal vurdere om jeg nærmer meg prosjektet helt feil, eller om det er noe triks jeg savner, eller hvis det bare er noe som ikke har lært ennå. Hvis noen med litt ekspertise kunne dytte meg i riktig retning, vil jeg virkelig sette pris på det!
Jeg har lagt ved all koden til dette innlegget. Beklager hvis det er et forferdelig rot. Gå lett på meg, jeg er nybegynner!
const invDate = Date ();
var field = " " +
" " +
"  
 
";
document.getElementById ('newInvoice'). onclick = funksjon () {
la invoicedName = ledetekst ('Hvem er denne fakturaen laget for?', 'Skriv inn et navn');
let productFields = Number (ledetekst ('Hvor mange produktnavn på denne fakturaen?', 'Vennligst skriv inn et nummer'));
la felt = ''
la dynHtml = ''
hvis (fakturert navn! = null && productFields! = null) {
for (la i = 1; i <= productFields; i ++) {
felt + = felt};
} else {alert ('Vennligst skriv inn gyldige innganger.');
};
dynHtml = "
  
 
" +
"
 FAKTURA 
" +
"
 Forberedt for: " + fakturert navn + ", på" +
"
" + invDate + "
 
 
" +
felt + "
 
" +
" 
";
document.write (dynHtml);
document.getElementById ('beregne'). onclick = funksjon getQtyFields () {
la qtyInputs = document.getElementsByName ('qty'),
resultQty = 0;
for (la j = 0; j
2020-12-15 08:12:42 
Som du sa, er hovedproblemet å finne en måte å gi hvert inndatafelt i sin egen rad sin egen unike identifikator. På denne måten kan du beregne prisen for hver rad og sette den inn i prisfeltet.
Du må først starte med feltene:
var field = " " +
" " +
"  
 
";
document.getElementById ('newInvoice'). onclick = funksjon () {
...
for (la i = 1; i <= productFields; i ++) {
felt + = felt};
...
};
Hver gruppe trenger sin egen identifikator. På den måten kan du senere henvise til hver inngang i hver rad for å beregne den totale totalsummen. Klasseattributtet er noe du kan tildele til flere elementer for å referere til dem senere. Denne klassen kan være hva som helst så lenge den ikke kommer i konflikt med klassen for noen annen rad. Du kan bruke i av loop som din identifikator, siden den endres med hver loop.
for (la i = 1; i <= productFields; i ++) {
var field = " " +
" " +
"  
 
";
felt + = felt
};
Dette vil legge til klasseraden {i} i hvert felt i hver rad. Enda bedre, du kan omformulere dette til sin egen funksjon
funksjon createFields (i) {
returner " " +
" " +
"  
 
";
}
for (la i = 1; i <= productFields; i ++) {
felt + = genererFelt (i);
};
Du får noe som ligner på følgende html
 
 
  
 

 
 
  
 

 
 
  
 

Nå i beregningsfunksjonen din kan du referere til disse radene og beregne prisen. Her kan du gå over inntastingsfeltene for 'element'.
document.getElementById ('beregne'). onclick = funksjon getQtyFields () {
la itemInputs = document.getElementsByName ('item')
for (la i = 0; i )
for (la i = 0; i